.my-table-container {
    width: 100%;
    height: 100%;
}

.my-table-head,
.my-table-body-container {
    width: 100%;
}

.my-table-head {
    height: 25px;
    border-collapse: collapse;
    /*border: none;*/
}

.my-table-body-container {
    height: calc(100% - 25px);
    position: relative;
    overflow: hidden;
}

.my-table-head thead tr {
    border-top: 1px solid #00364d;
}

.my-table-head thead tr th {
    /*background-color: rgba(33, 193, 255, 0.4);*/
    background-color: transparent;
    /*color: rgb(238, 221, 29);*/
    color: #659df2;
    font-size: 80%;
    height: 25px;
    line-height: 25px;
    cursor: pointer;
    user-select: none;
}

.my-table-body {
    border-collapse: collapse;
    /*border-spacing: 0 10px;*/
    border-spacing: 0 0;
    border: none;
    width: 100%;
    position: absolute;
    transition: top 0.5s linear;
}

.my-table-body tbody tr {
    background-color: transparent;
    cursor: pointer;
}

.my-table-body tbody tr:nth-child(odd) {
    background-color: rgba(39, 104, 136, 0.3);
}

.my-table-body tbody tr td {
    text-align: center;
    /*color: rgb(116, 147, 189);*/
    color: #ffffff;
    font-size: 12px;
    height: 25px;
    line-height: 25px;
}

.my-table-body tbody tr td.active {
    color: #ffbd1f;
}